<link rel="stylesheet" href="jquery.notice.css" />
<script src="jquery.js"></script>
<script src="jquery.notice.js"></script>
<script>
    $(document).ready(function()
{
        $('button.add').click(function()
        {
                jQuery.noticeAdd({
                        text: 'This is a notification that you have to remove',// content of the item
                        stay: true,// should the notice item stay or not?
                        inEffect:               {opacity: 'show'},      // in effect
                        inEffectDuration:       600,                    // in effect duration in miliseconds
                        stayTime:               3000,                   // time in miliseconds before the item has to disappear
                        type:                   'error'                // could also be error, success or notice
                });
        });
        
        $('button.add2').click(function()
        {
                jQuery.noticeAdd({
                        text: 'This is a notification that does not stay',
                        stay: false
                });
        });
        
        $('button.remove').click(function()
        {
                jQuery.noticeRemove($('.notice-item-wrapper'), 400);
        });
});
</script>
<body style="margin: 0 auto">
    <div style="width: 90%;height: 100%; background-color: #cccccc">
        <button class="add">Add sticky notice</button>
        <button class="add2">Add normal notice</button>
        <button class="remove">Revome all notices</button>
    </div>
</body>